<template>
  <div class="secondchart">
    <el-card shadow="hover">
      <Header @tab-change="changeTab" :active="activeTab"></Header>
       <First v-if="activeTab === 0" />
        <Second v-if="activeTab === 1" />
    </el-card>
  </div>
</template>

<script setup lang="ts">
import First from '@/Second/First.vue';
import Second from '@/Second/second.vue';
import Header from '@/Second/Header.vue';
import { ref } from 'vue';
const activeTab = ref(0);

const changeTab = (index: number) => {
  activeTab.value = index;
};
</script>

<style scoped>
.secondchart {
  margin: 0 20px 20px 20px;
}

</style>
